<div class="team-member text-center">
    <div class="relative mb-4 rounded-lg overflow-hidden aspect-square">
        {{ if .Get "image" }}
        <img src="{{ .Get "image" }}" alt="{{ .Get "name" }}" class="w-full h-full object-cover">
        {{ else }}
        <div class="w-full h-full bg-gray-200 flex items-center justify-center">
            <svg class="w-20 h-20 text-gray-400" fill="currentColor" viewBox="0 0 24 24">
                <path d="M12 14c3.31 0 6-2.69 6-6s-2.69-6-6-6-6 2.69-6 6 2.69 6 6 6zm0 2c-4 0-12 2-12 6v2h24v-2c0-4-8-6-12-6z"/>
            </svg>
        </div>
        {{ end }}
        {{ if .Get "linkedin" }}
        <a href="{{ .Get "linkedin" }}" target="_blank" rel="noopener" class="absolute bottom-2 right-2 bg-white rounded-full p-2 shadow-md hover:shadow-lg transition-shadow">
            <svg class="w-5 h-5 text-blue-600" fill="currentColor" viewBox="0 0 24 24">
                <path d="M19 0h-14c-2.761 0-5 2.239-5 5v14c0 2.761 2.239 5 5 5h14c2.762 0 5-2.239 5-5v-14c0-2.761-2.238-5-5-5zm-11 19h-3v-11h3v11zm-1.5-12.268c-.966 0-1.75-.79-1.75-1.764s.784-1.764 1.75-1.764 1.75.79 1.75 1.764-.783 1.764-1.75 1.764zm13.5 12.268h-3v-5.604c0-3.368-4-3.113-4 0v5.604h-3v-11h3v1.765c1.396-2.586 7-2.777 7 2.476v6.759z"/>
            </svg>
        </a>
        {{ end }}
    </div>
    <h3 class="text-xl font-bold mb-1">{{ .Get "name" }}</h3>
    <p class="text-gray-600">{{ .Get "title" }}</p>
</div>
